.slider {
    width: 100%;
    height: 1rem;

    display: flex;
    align-items: center;
    position: relative;

    &:hover {
        cursor: pointer;
    }

    &__line {
        width: 100%;
        height: 0.125rem;
        background-color: #ccc;
        position: absolute;
        left: 0;
    }

    &__bar {
        width: 1rem;
        height: 1rem;
        border-radius: 50%;
        background-color: red;
        position: absolute;
        left: 0;
        z-index: 9;
    }

    &__fill_line {
        width: 80%;
        height: 0.125rem;
        background-color: #333;
        position: absolute;
        right: 0;
    }
}